<template>
	<w-container id='order-details' class='page-bg' :loading="loading">
		<w-navbar navType="default" id="my-nav" title="订单详情"></w-navbar>
		<OrderStatus :order='info' @finish='getOrderInfo'/>
		<view class="info-container bg-color-item pa-16 br-t-12 mt-12">
			<GoodsBar :order='info'/>
			<GoodsInfo class='mt-24' :order='info'/>
		</view>
		<OrderAction :order='info' @statusChange='getOrderInfo' v-if="![5,6].includes(info.order_status)" />
	</w-container>
</template>

<script>
	import {getRegiftOrderDetails} from '@/api/order/index.js'
	import OrderStatus from './components/orderStatus.vue'
	import GoodsBar from './components/goodsBar.vue'
	import GoodsInfo from './components/goodsInfo.vue'
	import OrderAction from './components/orderAction.vue'
	export default {
		components:{OrderStatus,GoodsBar,GoodsInfo,OrderAction},
		data() {
			return {
				orderId:null,
				loading:false,
				orderType:null,
				info:{}
			};
		},
		onLoad({id,orderType}) {
			this.orderType=orderType;
			this.orderId=id;
			this.getOrderInfo();
		},
		methods:{
			//获取订单信息
			getOrderInfo(){
				if(this.loading) return;
				this.loading=true;
				getRegiftOrderDetails(this.orderId).then(res=>{
					this.loading=false;
					this.info=res.data;
				}).catch(e=>{
					setTimeout(()=>{
						this.backPage();
					},1500)
				})
			}
		}
	}
</script>

<style lang="scss">
	#order-details{
		padding-bottom: calc(env(safe-area-inset-bottom) + 120rpx);
		.info-container{
		}
	}

</style>
